<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org">
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org">
<head th:include="common_css :: commonHeader('注册用户')"></head>
<body style="background-color: #ffffff">
<!--注册-->
<div id="register">
    <form id="myform" method="post">
        <div style="margin-top: 20px">
            <table cellpadding="2px" cellspacing="0" class="form-table" style="margin: 0 auto">
                <tr>
                    <td>用户名</td>
                    <td>
                        <input class="easyui-validatebox"
                               data-options="required:true" missingMessage="请输入用户名"
                               validType="chinese" name="name"></input>
                    </td>
                </tr>
                <tr>
                    <td>登录名称</td>
                    <td>
                        <input name="userLoginId" id="userLoginId"
                               class="easyui-validatebox" data-options="required:true"
                               missingMessage="请输入登录名称"
                               validType="userLoginId"/>
                    </td>
                </tr>
                <tr>
                    <td>新密码</td>
                    <td><input class="easyui-validatebox" missingMessage="请输入新密码" data-options="
	                         required:true,validType:['passindexof','pwdrules','isSame','isSerial']"
                               type="password" id="newPassword"></td>
                </tr>
                <tr>
                    <td>确认新密码</td>
                    <td><input class="easyui-validatebox" missingMessage="请输入确认新密码" data-options="required:true"
                               validType="affirmPassword['newPassword']"
                               type="password" name="userPassword"></td>
                </tr>

                <tr>
                    <td>身份证号</td>
                    <td><input class="easyui-validatebox"
                               data-options="required:true" missingMessage="请输入身份证号"
                               validType="idcard" name="idcard"></input>
                    </td>
                </tr>
                <tr>
                    <td>职 位</td>
                    <td><input class="easyui-validatebox"
                               data-options="required:true" missingMessage="请输入职位" name="possition"></input></td>
                </tr>
                <tr>
                    <td>性 别</td>
                    <td>
                        <input type="radio" name="sex" checked
                               class="easyui-validatebox" value="1"><label>男</label></input>
                        <input type="radio" name="sex"
                               class="easyui-validatebox" value="2"><label>女</label></input>
                    </td>
                </tr>
                <tr>
                    <td>电邮地址</td>
                    <td><input id="email" name="email" class="easyui-validatebox"
                               data-options="required:true" missingMessage="请输入邮件"
                               validType="email" invalidMessage="请填写正确的邮件格式"></input></td>
                </tr>
                <tr>
                    <td>地 址</td>
                    <td><input class="easyui-validatebox"
                               data-options="required:true" missingMessage="请输入地址"
                               name="address"></input></td>
                </tr>
                <tr>
                    <td>联系电话</td>
                    <td><input name="phone"
                               class="easyui-validatebox"
                               data-options="required:true" missingMessage="请输入联系电话" validType="phone"></input></td>
                </tr>
                <tr>
                    <td>手机号码</td>
                    <td><input name="mobile" class="easyui-validatebox"
                               data-options="required:true" missingMessage="请输入手机号码" validType="mobile"></input>
                    </td>
                </tr>
                <!--    <tr>
                        <td>验证码</td>
                        <td><input class="easyui-validatebox"
                                   data-options="required:true" missingMessage="请输入验证码"
                                   shorterName="phonecode"></input>
                            <input type="button" id="btnSendCode" style="background: #ffa8a8;
                                 height: 24px; line-height: 20px;
                              text-align: center;border: 1px #fff3f3 solid;color: #000;"
                                   onclick="sendCode()" value="获取验证码"></input>
                        </td>
                    </tr>-->
                <tr>
                    <td>用户头像</td>
                    <td colspan="4">
                        <input type="hidden" name="description">
                        <img title="点击上传LOGO" onclick="uploadimg();" alt="点击上传"
                             src="/img/pic_no.png"
                             id="img" name="" width="120"
                             height="120">
                    </td>
                </tr>
            </table>
        </div>
    </form>
</div>
<div id="dlg-buttons" style="text-align:center">
    <a id="save" href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-save" onclick="saveItem()">保存</a>
    <a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-back" onclick="backdlg()">返回</a>
</div>
</div>

<div style="display: none;">
    <form id="subimg" action="/image/upload" enctype="multipart/form-data" method="post">
        <input accept=".png,.jpg,.gif" name="file" size="20" type="file"
               id="uploadimg" onchange="setImagePreview(this.value);">
    </form>
</div>
<div th:include="common_js :: commJS"></div>
<script type="text/javascript">
    //清空表格信息，恢复获取验证码点击按钮事件
    $(function () {
        $("#myform").form('clear');//添加之前清空表达信息
        $("input[type='radio']").eq(0).prop("checked", "checked");
    })

    // 点击上传头像
    function uploadimg() {
        $("#uploadimg").click();
    }

    /**
     * 图片上传
     * @param fileName
     */
    function setImagePreview(fileName) {
        //文件后缀格式
        if (!/\.(jpg|JPG|jpeg|JPEG|gif|GIF|png|PNG|bmp|BMP)$/.test(fileName)) {
            $.messager.alert('系统提示', '错误的类型，请选择图片', 'error');
            return;
        }
        $('#subimg').form('submit', {
            url: "/image/upload",
            onSubmit: function (param) {
                param.oldImageId = $("input[name='description']").val();
                $.messager.progress({text: '正在处理中...'});
            }, success: function (data) {
                $.messager.progress('close');
                data = JSON.parse(data);
                if (successcode == data.code) {
                    $("#img").attr("src", data.data);//图片上传成功的图片地址
                    $("input[name='description']").val(data.data);
                } else if (data) {
                    $.messager.alert('系统提示', data.message, 'error');
                }
            }, error: function (data) {
                $.messager.alert('系统提示', "系统异常，请稍后重试！", 'error');
            }
        });
    }

    function saveItem() {
        //验证表单信息
        if ($("#myform").form('validate')) {//验证表单信息
            $.messager.confirm('系统提示', "确定注册用户信息吗？", function (r) {
                if (r) {
                    doSaveItem();
                }
            });
        }
    }

    //保存的方法
    function doSaveItem() {
        $('#myform').form('submit', {
            url: "/userLoginInfo/addNewUser",
            onSubmit: function () {
                //验证表单信息
                $.messager.progress({text: '正在注册中...',});
            }, success: function (data) {
                $.messager.progress('close');
                try {
                    data = JSON.parse(data);
                    if (data && data.message == "success") {
                        //关闭弹出窗口
                        window.parent.closeDlg("注册成功！");//调用父页面的关闭窗口方法
                    } else if (data && data.message == "error") {
                        $.messager.alert('系统提示', data.errorMessage, 'error');
                    }
                } catch (e) {
                    //错误提示信息的方法
                    $.messager.alert('系统提示', "注册失败，请稍后重试！", 'error');
                }
            }
        });
    }

    function backdlg() {
        window.parent.closeDlg("");//调用父页面的关闭窗口方法
    }
</script>
</body>
</html>
